<tab [lists] = "subLists" [activeTab]="activeTabIndex" [tabClicked]="tabClicked" [change]="mustChange" (tabToggle)="tabToggle($event)"></tab>
<div class="segment-container" #f10Content (scroll)="scrollEvent($event, f10Content, el1, el2, el3)">
  <div class="segment sub-title-0" #el1>
    <p class="segment-title"><span class="little-cube"></span>{{subLists[0].label}}</p>
    <div class="seg-body">
      <text-show [data]="compIntroSource | async"></text-show>
    </div>
  </div>
  <div class="segment sub-title-1" #el2>
    <p class="segment-title"><span class="little-cube"></span>{{subLists[1].label}}</p>
    <div class="seg-body">
      <!--<table-tab [lists]="chartTab" (tableToggle)="toggleChart($event)"></table-tab>-->
      <div class="polar-chart">
        <!-- 极区图 -->
        <!--<polar-area [data]="chartSource | async"></polar-area>-->
        <draw-chart [data]="chartSource | async"></draw-chart>
      </div>
      <table-tab [lists]="mainoperincomeTab | async" (tableToggle)="mainoperincomeTimeToggle($event)"></table-tab>
      <classify-table [data]="mainoperincomeSource | async" [header]="mainoperincomeHeader" [clickedKey]="clickedKey" (togglePolarChart)="togglePolarChart($event)"></classify-table>
    </div>
  </div>
  <div class="segment sub-title-2" #el3>
    <p class="segment-title"><span class="little-cube"></span>{{subLists[2].label}}</p>
    <div class="seg-body">
      <table-tab [lists]="operstatusTab | async" (tableToggle)="operstatusTimeToggle($event)"></table-tab>
      <text-show [data]="operstatusSource | async"></text-show>
    </div>
  </div>
  <!--<disclaimer></disclaimer>-->
</div>